
.spinner-sprite, .spinner .decrease, .spinner .decrease[disabled], .spinner .increase, .spinner .value, .spinner .value.passive {
    background: url('../images/spinner.png') no-repeat
}

.spinner {
    height: 25px;
    float: left;
    width: 71px;
    overflow: hidden;
    margin: 0 auto;
    margin-top: 5px;
    *zoom: 1;
    -webkit-box-shadow: 0 3px 3px -4px #aaa;
    -moz-box-shadow: 0 3px 3px -4px #aaa;
    box-shadow: 0 3px 3px -4px #aaa
}

.spinner button, .spinner .value {
    text-align: center;
    display: block;
    float: left;
    height: 100%;
    line-height: 25px;
    margin: 0
}

.spinner button {
    border: none;
    width: 23px;
    color: #e5312a;
    font: 22px Arial bold;
    padding: 0;
    outline: none
}

.spinner .decrease {
    background-position: 0 -50px;
    cursor: pointer;
    text-indent: -10000px
}

.spinner .decrease[disabled] {
    background-position: 0 -75px;
    cursor: default
}

.spinner .increase {
    background-position: 0 0;
    cursor: pointer;
    text-indent: -10000px
}

.spinner .value {
    background-position: 0 -25px;
    width: 24px;
    height: 27px;
    border: none;
    font-family: Arial;
    color: #000;
    padding: 0px
}

.spinner .value.passive {
    background-position: 0 -25px;
    color: #919191
}

.spinner .error, .spinner .invalid {
    background: #aa0000
}